<template>
    <div>
        <h4 class="font-weight-bold py-3 mb-4">
            <span class="text-muted font-weight-light">风控主体结果 /</span> 打分卡结果
        </h4>

        <hr class="border-light container-m--x mt-0 mb-5">
        <Row>
            <b-form inline>
                <label class="form-label mr-sm-2">风控主体：</label>
                <Select v-model="subjectName.model" class="mr-sm-4" style="width:100px">
                    <Option v-for="item in subjectName.list" :value="item.value" :key="item.value">{{ item.label }}</Option>
                </Select>
                <label class="form-label mr-sm-2">风控主体内容：</label>
                <b-input type="text" placeholder="风控主体内容" />
                <Button @click="handleSearch" type="primary" icon="ios-search">Search</Button>
            </b-form>
        </Row>

        <sky-table :data="table.data" :columns="table.columns" :show-index="table.showIndex"></sky-table>

    </div>
</template>

<style scoped>

</style>

<script>
export default {
    name: "finalResultSubjectScorecard",
    metaInfo: {
        title: "风控主体结果 - 打分卡结果"
    },
    data() {
        return {
            table: {
                showIndex: false,
                data: [],
                columns: [
                    {
                        title: "风控主体",
                        key: "subjectName"
                    },
                    {
                        title: "风控主体内容",
                        key: "subjectValue"
                    },
                    {
                        title: "基准分",
                        key: "baseScore"
                    },
                    {
                        title: "最终得分",
                        key: "finalScore"
                    },
                    {
                        title: "打分时间",
                        key: "createTime"
                    },
                    {
                        title: "操作",
                        width: 160,
                        align: "center",
                        render: (h, params) => {
                            let vm = this;
                            return (
                                <div>
                                    <i-button
                                        type="info"
                                        size="small"
                                        class="mr-2"
                                        onClick={() => {
                                            return vm.goDetail(params);
                                        }}
                                    >
                                        查看明细
                                    </i-button>
                                </div>
                            );
                        }
                    }
                ]
            },
            subjectName:{
                list: [
                    {
                        value: "ALL",
                        label: "-- 请选择 --"
                    },
                    {
                        value: "客户主体",
                        label: "客户主体"
                    },
                    {
                        value: "保理申请",
                        label: "保理申请"
                    },
                    {
                        value: "垫资库存",
                        label: "垫资库存"
                    }
                ],
                model: "ALL",
            }
        };
    },
    created() {
        // Fetch json data
        const req = new XMLHttpRequest();
        req.open("GET", "/static/json/finalResult/subject-scorecard-data.json");

        req.onload = () => {
            const data = JSON.parse(req.response);

            // Add IDs for child rows functionality
            this.table.data = data;
        };

        req.send();
    },
    methods: {
        goDetail: function(p) {
            // console.log(p.row.name);
            alert(p.row.name);
        }
    }
};
</script>
